<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../css/mui.css" rel="stylesheet" />
		<style type="text/css">
			.mui-title {
				color: #208AFE;
			}
			
			.mui-content {
				width: 90%;
				margin-left: 5%;
				background-color: white;
				display: none;
			}
			
			.huo-div {
				margin-top: 5%;
			}
			
			.huo-p {
				color: black;
				font-size: 95%;
			}
			
			.money-p {
				color: red;
			}
			
			.arrea-p {
				color: black;
			}
			
			.go-area {
				color: #208AFE;
				float: right;
				margin-right: 10%;
			}
			
			.renwu-dv {
				padding-left: 6%;
				border-left: 5px solid #208AFE;
				border-radius: 2px;
			}
			
			.text1 {
				font-size: 80%;
				color: #98989C;
				display: block;
			}
			
			.padd-div {
				margin-top: 4%;
			}
			
			.write-text {
				font-size: 80%;
				border-color: #EDEDED;
				border: 0;
				padding-left: 0;
				color: #98989C;
			}
			
			.fiends-div {
				width: 100%;
				background-color: #FFFFFF;
				border-bottom: 1px solid #F7F7F7;
				padding: 3% 0;
				font-size: 100%;
				display: flex;
				flex-wrap: nowrap;
			}
			
			.fiends-div .friend-heddimg {
				width: 18%;
				margin-right: 5%;
				margin-left: 5%;
				height: 10%;
			}
			
			.fiends-div .agree-button {
				padding: 0;
				position: absolute;
				right: 3%;
				background-color: #077DFF;
				border: 0;
				padding: 0.5% 3%;
				font-size: 95%;
				color: #FFFFFF;
				z-index: 99;
			}
			
			.fiends-div .yagree-div {
				position: absolute;
				right: 5%;
				background-color: #FFFFFF;
				font-size: 80%;
				border-radius: 3px;
				color: #077DFF;
			}
			
			.card-div {
				display: none;
			}
			
			.conttext-div {
				display: flex;
				flex-wrap: wrap;
				padding: 0;
			}
			
			.conttext-div .div1 {
				display: block;
				width: 90%;
				padding: 0;
				list-style: none;
			}
			
			.div2 {
				color: #A9A9A9;
				font-size: 80%;
			}
			
			.div2 .img1 {
				width: 6%;
				position: absolute;
				right: 5%;
			}
			
			.div2 .img2 {
				width: 6%;
				position: absolute;
				margin-left: 3%;
			}
			
			.bottom-div {
				width: 100%;
				position: fixed;
				bottom: 0;
				left: 0;
				display: flex;
				background-color: #208AFE;
			}
			
			.divv {
				width: 50%;
			}
			
			.bottom-div-item {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				color: #FFFFFF;
			}
			
			.bottom-div-item1 {
				border-right: 1px solid #FFFFFF;
			}
			
			.bottom-div-item img {
				width: 12%;
				margin-right: 2%;
			}
		</style>
	</head>

	<body style="background-color: #FFFFFF;">
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">兼职详情</h1>
		</header>

		<div class="mui-content" id="mui-content">
			<div class="huo-div">
				<p class="huo-p" id="title"></p>
			</div>
			<p class="money-p" id="price"></p>
			<p class="arrea-p">
				<span id="area"></span>
				<text class='go-area' id='goarrea'>去这里</text>
			</p>
			<div class="renwu-dv">
				<p class="huo-p">任务要求</p>
			</div>
			<text class='text1'>结算周期：<text id="cycle"></text></text>
			<text class='text1'>招聘人数：<text id="personnum"></text></text>
			<text class='text1'>性别要求：<text id="sexneed"></text></text>
			<div class="renwu-dv padd-div">
				<p class="huo-p">详细内容</p>
			</div>
			<textarea name="" class="write-text" id="txtContent" rows="2" cols="30" disabled="true" placeholder="此处输入...." onkeyup="ResizeTextarea()"></textarea>
			<div class="renwu-dv">
				<p class="huo-p">工作时间</p>
			</div>
			<text class='text1'>起始时间：<text id="starttime"></text></text>
			<text class='text1'>结束时间：<text id="endtime"></text></text>
			<div class="renwu-dv padd-div">
				<p class="huo-p">联系方式</p>
			</div>

			<div class="fiends-div" id="fiends-div">
				<img src="" class="friend-heddimg" id="headmigg" />
				<div class="conttext-div">
					<div class="div1" id="nickname">					
					</div>
					<div class="div1 div2">
						手机号：<text id="tel"></text>
						<img src="../images/tel.png" class="img1" id="imgg1"/>
					</div>
					<div class="div1 div2">
						账号：<text id="card"></text>
						<img src="../images/addf.png" class="img2" id="imgg2"/>
					</div>
				</div>
			</div>
			
			<div class="bottom-div" id="bottom-div">
				<div class="divv">
					<div class="bottom-div-item bottom-div-item1">
						<img src="../images/zixun.png"/>
						<text>咨询</text>
					</div>
				</div>
				
				<div class="divv">
					<div class="bottom-div-item">
						<img src="../images/baoming.png"/>
						<text>报名</text>
					</div>
				</div>
			</div>
		</div>

		<script src="../js/mui.min.js"></script>
		<script src="../js/immersed.js"></script>
		<script type="text/javascript">
			mui.init();
			mui.plusReady(function() {
				starbar();
				plus.navigator.setStatusBarStyle('dark');

				//重写点击返回事件
				var old_back = mui.back;
				mui.back = function() {
					old_back();
					plus.navigator.setStatusBarStyle('light');
				}
				var viewwidth = document.body.clientWidth;
				document.getElementById('mui-content').style.paddingBottom = "-webkit-calc(" + viewwidth * 0.13 + "px)";
				document.getElementById('headmigg').style.height = "-webkit-calc(" + viewwidth * 0.18 * 0.9 + "px)";
				document.getElementsByClassName('divv')[0].style.cssText = "padding: -webkit-calc(" + viewwidth * 0.03 + "px) 0";
				document.getElementsByClassName('divv')[1].style.cssText = "padding: -webkit-calc(" + viewwidth * 0.03 + "px)  0"; 
				
				document.getElementById('goarrea').addEventListener('tap',function(){
					mui.alert('去这里');
				})
				
				//event.stopPropagation(); 阻止冒泡事件
				document.getElementById('imgg2').addEventListener('tap',function(e){
					event.stopPropagation();
					var ta_card = document.getElementById('card').textContent;
					e.detail.gesture.preventDefault();
					var btnArray = ['取消', '确定'];
					mui.prompt('请输入验证信息', '验证信息...', '添加好友', btnArray, function(e) {
						if (e.index == 1) {
							alert('1111')
//							mui.ajax({
//								url: 'https://www.lunyuwang.com/friendListController/clickAdd',
//								data: {
//									lyaddrequest_Text: e.value,
//								    lyaddrequest_Card: plus.storage.getItem("card"),
//								    lyaddrequested_Card: ta_card
//								},
//								async: true, //将false改为true
//								crossDomain: true, //强制使用5+跨域
//								dataType: 'json', //服务器返回json格式数据
//								type: 'get', //HTTP请求类型
//								timeout: 10000, //超时时间设置为10秒；
//								//processData: false,
//								headers: {
//									'Content-Type': 'application/x-www-form-urlencoded'
//								},
//								success: function(data) {
//									console.log(data.state)
//									if(data.state == 1) {
//										mui.toast('好友申请发送成功!')
//									}
//
//								},
//								error: function(xhr, type, errorThrown) {
//									//异常处理；
//									mui.alert("失败了！")
//
//								}
//							})
						}
					},'div')
				})
				
				document.getElementById('fiends-div').addEventListener('tap',function(event){
					event.stopPropagation();
					mui.openWindow({
						url: "goodfriend/addzhuhtml.html",
						id: "goodfriend/addzhuhtml.html",
						extras: {
							card: document.getElementById('card').textContent
						}
					})
				})
				
				document.getElementById("imgg1").addEventListener('tap',function(){
					event.stopPropagation();
		            var btnArray=['拨打','取消'];
		            var phone = document.getElementById('tel').value;
		            mui.confirm('是否拨打'+phone+'?','提示',btnArray,function(e){
		                if(e.index == 0){
		                    plus.device.dial(phone,false);
		                }
		            });
		        });

				
				mui('.bottom-div').on('tap','.divv',function(){
					var textcontentt = this.getElementsByTagName('text')[0].textContent
					if(textcontentt == '咨询'){
						mui.alert('咨询')
					}else{
						mui.alert('报名')
					}
				})
				
				
				var my_card = plus.storage.getItem("card");
				var ta_card = plus.webview.currentWebview().card;
				mui.ajax('https://www.lunyuwang.com/taskController/queryTaskDetail', {
					data: {
						lytask_Idd: plus.webview.currentWebview().idd,
						lyuser_Card: my_card,
						lyuser_Smbody: ta_card
					},
					crossDomain: true, //强制使用5+跨域
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					//processData: false,
					headers: {
						'Content-Type': 'application/x-www-form-urlencoded'
					},
					success: function(data) {
						var tasktext = data.taskDetail;
						var cardtext = data.taskUser;
						var areadw = document.getElementById('goarrea');
						var telpng = document.getElementById('imgg1');
						var addfriendpng = document.getElementById('imgg2');
						var bottombar = document.getElementById('bottom-div');
						document.getElementById('title').textContent = tasktext.lytask_Title;
						document.getElementById('price').textContent = tasktext.lytask_Pay;
						document.getElementById('area').textContent = tasktext.lytask_Adress;
						document.getElementById('cycle').textContent = tasktext.lytask_Cycle;
						document.getElementById('personnum').textContent = tasktext.lytask_Number;
						document.getElementById('sexneed').textContent = tasktext.lytask_Sex;
						document.getElementById('txtContent').value = tasktext.lytask_Text;
						document.getElementById('starttime').textContent = tasktext.lytask_Start;
						document.getElementById('endtime').textContent = tasktext.lytask_End;
						document.getElementById('headmigg').src = cardtext.lyuser_FacePath;
						document.getElementById('nickname').textContent = cardtext.lyuser_NickName;
						document.getElementById('tel').textContent = cardtext.lyuser_Tel;
						document.getElementById('card').textContent = cardtext.lyuser_Card;
						if(data.flag == 1){
							addfriendpng.style.display = 'none';
						}else if(my_card == ta_card){
							areadw.style.display = 'none';
							telpng.style.display = 'none';
							addfriendpng.style.display = 'none';
							bottombar.style.display = 'none'
						}
						plus.nativeUI.closeWaiting();
						document.getElementById('mui-content').style.display = "block";

					},
					error: function(xhr, type, errorThrown) {
						mui.toast('发布异常!')
					}
				})
			})

			//textarea自适应说说高度
			function ResizeTextarea() {
				// 最小高度  
				var minRows = 2;
				// 最大高度，超过则出现滚动条  
				var maxRows = 100;
				var t = document.getElementById('txtContent');
				if(t.scrollTop == 0) t.scrollTop = 1;
				while(t.scrollTop == 0) {
					if(t.rows > minRows)
						t.rows--;
					else
						break;
					t.scrollTop = 1;
					if(t.rows < maxRows)
						t.style.overflowY = "hidden";
					if(t.scrollTop > 0) {
						t.rows++;
						break;
					}
				}
				while(t.scrollTop > 0) {
					if(t.rows < maxRows) {
						t.rows++;
						if(t.scrollTop == 0) t.scrollTop = 1;
					} else {
						t.style.overflowY = "auto";
						break;
					}
				}
			}
		</script>
	</body>

</html>